import { useDispatch, useSelector } from 'react-redux';
import React, { useEffect } from 'react';
import axios from 'axios';

const Index = (props) => {
  const list = useSelector(state => state.list);
  const { page, typeid, data } = list;
  const article = useSelector(state => state.article);
  const dispatch = useDispatch();

  useEffect(() => {
    console.log('挂在完成');
    dispatch((dispatch, getState) => {
      axios.get(`/api/v1/articles?page=${page}&typeid=${typeid}`).then(res => {
        dispatch({
          type: 'LIST_DATA',
          data: res.data
        })
      }).catch(e => {
        console.log(e);
      })
      // setTimeout(() => {
      //   dispatch({
      //     type: 'ARTICLE_ADD'
      //   })
      // }, 1000);
    })
  }, [])

  console.log(list);

  return (
    <div>
      <h1>react 异步</h1>
      {
        data.map(item => <p key={item.id}>{item.source}</p>)
      }
    </div>
  )
}

export default Index;